<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>所有预约单</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${basePath!}/genius/layui/css/layui.css" media="all">
</head>
<style>
    .ew-tree-table-group .ew-tree-table-box {
        overflow: auto;
        max-height: 905px;
    }
</style>
<body style="overflow: hidden;">

<div class="layui-fluid">
    <div class="layui-card">

        <div class="layui-card-body">
            <div style="padding-bottom: 0;">
                <div class="layui-form layuiadmin-card-header-auto">
                    <div class="layui-form-item">
                        <button class="layui-btn " data-type="add"><i
                                class="layui-icon layui-icon-add-circle "></i> 新增
                        </button>

                        <button class="layui-btn layui-btn-danger" data-type="delete"><i
                                class="layui-icon layui-icon-delete "></i> 删除
                        </button>


                        <div class="layui-inline layui-float">
                            <button class="layui-btn layui-btn-sm layuiadmin-btn-useradmin layui-btn-normal"
                                    lay-submit lay-filter="LAY-search-submit" style="margin-top: 4px">
                                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>查询
                            </button>
                        </div>


                        <div class="layui-inline layui-float">
                            <input type="text" readonly class="layui-input" name="date" id="date"
                                   placeholder="选择日期">
                        </div>

                        <div class="layui-inline layui-float">
                            <input type="text" class="layui-input" name="line_code" id="line_code"
                                   placeholder="线路">
                        </div>

                        <div class="layui-inline layui-float">
                            <input type="text" class="layui-input" name="car_code" id="car_code"
                                   placeholder="车牌号">
                        </div>
                        <div class="layui-inline layui-float">
                            <input type="text" class="layui-input" name="driver_name" id="driver_name"
                                   placeholder="司机">
                        </div>
                        <div class="layui-inline layui-float">
<!--                            <input type="text" class="layui-input" name="driver_name" id="driver_name"-->
<!--                                   placeholder="司机">-->
                            <select name="status" id="status">
                                <option value=""   selected="">请选择状态</option>
                                <option value="1" >未装车</option>
                                <option value="2" >已装车</option>
                                <option value="3" >已发车</option>
                                <option value="4" >已结束</option>
                                <option value="5" >已回车</option>
                                <option value="6" >已完成</option>
                            </select>
                        </div>
                        <div class="clearfix"></div>

                    </div>


                </div>
                <table id="LAY-waybill-list" lay-filter="LAY-waybill-list"></table>

            </div>
        </div>
    </div>

    <script src="${basePath!}/genius/layui/layui.js"></script>

    <!--  <script type="text/html" id="checkDriver">-->
    <!--      <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="checkDriver">查看司机详情</a>-->
    <!--  </script>-->


    <!--  <script type="text/html" id="checkPlatform">-->
    <!--      <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="checkPlatform">查看月台详情</a>-->
    <!--  </script>-->

    <!--  <script type="text/html" id="checkReceiver">-->
    <!--      <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="checkReceiver">查看收货员详情</a>-->
    <!--  </script>-->


    <script>
        // layui.config({
        // 	base: '${basePath!}/genius/' //静态资源所在路径
        // 		,
        // 	host: '${basePath!}' //项目访问路径
        // }).extend({
        // 	index: 'lib/index' //主入口模块
        // 		,
        // 	select: 'reservation/receiveManager/select'
        // }).use(['index', 'select']);

        function backUrl() {
            var bakUrl = parentJson.bakUrl;
            window.location.href = bakUrl;
        }

        let postUrl = function (params, url) { //调整页面及导出可以用此方法
            var form = document.createElement("form");
            form.style.display = 'none';
            form.action = url;
            form.method = "get";
            document.body.appendChild(form);

            for (var key in params) {
                var input = document.createElement("input");
                input.type = "hidden";
                input.name = key;
                input.value = params[key];
                form.appendChild(input);
            }
            form.submit();
            form.remove();
        }

        layui.config({
            base: '${basePath!}/genius/' //静态资源所在路径
            , host: '${basePath!}'//项目访问路径
        }).extend({
            setter: 'config'
        }).use(['table', 'form', 'util', 'laydate', 'setter'], function () {
            var $ = layui.$,
                form = layui.form,
                table = layui.table,
                util = layui.util,
                laydate = layui.laydate,
                setter = layui.setter;

            laydate.render({
                elem: '#date' //指定元素
            });

            colsArr = [{
                type: 'checkbox',
                fixed: 'left'
            }, {
                field: '',
                title: '序号',
                width: 80,
                type: 'numbers'
            },
                {
                    field: 'lineName',
                    title: '线路名称',
                    align: 'center',
                    width: 120,
                    templet: function (d) {
                        return '<p><a style="color:blue" lay-active="e1" href="javascript:;"  data-id=' + d
                            .waybillNumber + ' >' + d.lineName + '</a></p>'
                        //状态 1.未装车2.已装车3.已发车4.已结束5.已回车 6已完成
                    }
                },
                {
                    field: 'carCode',
                    title: '车牌号',
                    align: 'center'
                },
                {
                    field: 'driverNumber',
                    title: '司机工号',
                    align: 'center'
                },
                {
                    field: 'driverName',
                    title: '司机',
                    align: 'center'
                },
                {
                    field: 'followerNumber',
                    title: '跟车员工号',
                    align: 'center'
                },
                {
                    field: 'followerName',
                    title: '跟车员',
                    align: 'center'
                },

                {
                    title: '同行员',
                    align: 'center',
                    templet: function (d) {
                        if (d.peers.length != 0) {
                            let i = ""
                            for (let p of d.peers) {
                                i += (p.name + ",")
                            }
                            return i.slice(0, -1)
                        } else {
                            return '-'
                        }
                        //状态 1.未装车2.已装车3.已发车4.已结束5.已回车 6已完成
                    }
                },
                {
                    field: 'setOutTime',
                    title: '运输开始时间',
                    align: 'center'
                },
                {
                    field: 'backTime',
                    title: '运输结束时间',
                    align: 'center'
                }, {
                    field: 'emptyTrunBox',
                    title: '回箱数',
                    align: 'center',
                    templet: function (d) {
                        if(d.emptyTrunBox!=null){
                            return d.emptyTrunBox<0?"未获取":d.emptyTrunBox
                        }else{
                            return "未获取"
                        }
                    }
                }, {
                    field: 'status',
                    title: '车辆状态',
                    align: 'center',
                    templet: function (d) {
                        //状态 1.未装车2.已装车3.已发车4.已结束5.已回车 6已完成
                        switch (d.status) {
                            case 1:
                                return '<p style="color:#FF6103" >未装车</p>'
                            case 2:
                                return '<p style="color:#40E0D0" >已装车</p>'
                            case 3:
                                return '<p style="color:#082E54" >已发车</p>'
                            case 4:
                                return '<p style="color:#DAA569" >回车中</p>'
                            case 5:
                                return '<p style="color:#ED9121" >已回车</p>'
                            case 6:
                                return '<p style="color:#3D9140" >已完成</p>'
                        }
                    }
                }
            ]
            table.render({
                elem: '#LAY-waybill-list',
                limit: 15,
                limits: [15, 30, 50],
                cols: [colsArr],
                height: 'full-200',
                page: true, //开启分页
                method: 'post',
                url: setter.reqBase + '/follower/getAllWayBillTable',
                parseData: function (res) {
                    return {
                        code: res.code,
                        data: res.data.data,
                        count: res.data.count,
                        msg: ''
                    }
                },
                text: {
                    none: '暂无相关数据'
                }
            })
            util.event('lay-active', {
                e1: function (othis) {
                    layer.open({
                        type: 1,
                        title: '线路详情',
                        content: `<table id="LAY-sequence-list" lay-filter="LAY-sequence-list" lay-size="sm"></table>`,
                        area: ['720px', '590px'],
                        btn: ['确定', '取消'],
                        success: (editFrame, index) => {
                            var iframeWindow = window['layui-layer-iframe' + index]
                            console.log(othis)
                            subBody = editFrame.find('iframe').contents();
                            colsArr1 = [{
                                field: '',
                                title: '序号',
                                width: 40,
                                type: 'numbers'
                            },
                                {
                                    field: 'storeNumber',
                                    title: '店号',
                                    align: 'center',
                                    width: 120,
                                },
                                {
                                    field: 'storeName',
                                    title: '店名',
                                    align: 'center',
                                },
                                {
                                    field: 'actualArrivalTime',
                                    title: '到店时间',
                                    align: 'center',
                                    templet: function (d) {
                                        return d.actualArrivalTime ? d
                                            .actualArrivalTime : '未到达'
                                        //状态 1.未装车2.已装车3.已发车4.已结束5.已回车 6已完成
                                    }
                                },
                                {
                                    field: 'leaveStoreTime',
                                    title: '离店时间',
                                    align: 'center',
                                    templet: function (d) {
                                        return d.leaveStoreTime ? d.leaveStoreTime :
                                            '未离店'
                                        //状态 1.未装车2.已装车3.已发车4.已结束5.已回车 6已完成
                                    }
                                },
                                {
                                    field: 'index',
                                    title: '运送顺序',
                                    align: 'center',
                                },
                            ]
                            table.render({
                                elem: '#LAY-sequence-list',
                                limit: 15,
                                limits: [15, 30, 50],
                                cols: [colsArr1],
                                height: 'full',
                                page: true, //开启分页
                                // toolbar: 'default',
                                method: 'post',
                                where: {
                                    waybillNumber: othis.context.dataset.id
                                },
                                url: setter.reqBase + '/follower/getSequence',
                                text: {
                                    none: '暂无相关数据'
                                }
                            })
                            // console.log(editFrame);
                            // console.log(index);
                            // console.log(editFrame.find('iframe').contents());
                        }
                    })
                    // console.log(JSON.parse(othis.context.dataset.id));
                }
            });


            form.on('submit(LAY-search-submit)', function (data) {
                //		tableSearch[data.field.whereKey] = data.field.whereValue;
                //执行重载
                // console.log(tableHead)
                // console.log(field)
                table.reload('LAY-waybill-list', {
                    url: setter.reqBase + '/follower/getAllWayBillWhere',
                    where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                        search: data.field //查询字段
                    },
                    parseData: function (res) {
                        console.log(res.data.data);
                        return {
                            code: res.code,
                            data: res.data.data,
                            count: res.data.count,
                            msg: ''
                        }
                    }
                });
            });


            $('.layui-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });


            var active = {
                add: function () {
                    var obj = {};
                    obj.bakUrl = '/unite_platform/waybillManager';
                    obj.jsType = 'add';
                    postUrl(obj, '/unite_platform/insertWaybill');
                },
                delete: function () {
                    var checkData = table.checkStatus('LAY-waybill-list');
                    if (checkData.data.length === 0) {
                        return layer.msg('请选择一行数据进行删除');
                    }
                    console.log(checkData.data);
                    $.post(setter.reqBase + '/follower/getWaybillInfo', {
                        waybillNumber: checkData.data[0].waybillNumber
                    }, res => {
                        if (res.data.status != 1) {
                            return layer.msg('当前状态无法删除');
                        } else {
                            $.post(setter.reqBase + '/follower/deleteWaybill', {
                                //发送添加的出车条款表单数据
                                waybill: checkData.data
                            }, (res) => {
                                if (res.code == 0) {
                                    layer.msg('删除成功', {
                                        icon: 1
                                    }, function () {
                                        table.reload('LAY-waybill-list')
                                    });
                                } else {
                                    layer.msg(res.msg);
                                }
                            })
                        }
                    })
                },
            }
        })
    </script>
</body>
</html>
